<template>
  <div>
    <ul>
      <li v-for="item in list" :key="item">
        {{ item.value }}<button @click="del(item.id)">删除</button>
      </li>
    </ul>
    <button @click="cli">生成</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: [
        { id: 1, value: 11 },
        { id: 2, value: 17 },
        { id: 3, value: 3 },
      ],
    };
  },
  methods: {
    cli() {
      let num = Math.floor(Math.random() * 20);
      this.list.push({ id: +new Date(), value: num });
    },
    del(id) {
      this.list = this.list.filter((item) => item.id!== id);
    },
  },
};
</script>

<style>
</style>